<template>
  <list-box :name="name" :word="word">
    <scroll-view scroll-x class="list-scroll noScorll">
      <view class="list-scroll-view" v-for="(item,index) in props.courseData" :key="index">
        <course-item :isColumn="true" :item="item"></course-item>
      </view>
    </scroll-view>
  </list-box>
</template>

<script setup lang="ts">
  import listBox from "./list-box.vue"
  import courseItem from "@/components/common/course-item.vue"
  const props = defineProps({
    name: {
      type: String,
      default: '近期上新'
    },
    word: {
      type: String,
      default: null
    },
    courseData: {
      type: Array,
      default: () => []
    }
  })
</script>

<style lang="scss" scoped>
  .list-scroll {
    white-space: nowrap;
    height: 380rpx;

    .list-scroll-view {
      display: inline-block;
      width: 310rpx;
      padding: 0 10rpx;
      margin-right: 20rpx;
      border-radius: 20rpx;
      box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
      background-color: #fff;
    }
  }
</style>
